<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
  <script type="text/javascript" src="/static/script/jquery-1.7.2.js"></script>
  <link type="text/css" rel="stylesheet" href="/static/css/style.css" >
  <script>
    $(function (){
        //给登录按钮绑定单击事件
        $("#sub_btn").click(function(){
          //获取用户输入的用户名
          /*
              val()：用来获取或设置input中的value属性值
              对象.val()：获取value属性值
              对象.val("new Value")：设置value属性值
          */
          var username = $("#username").val();
          //判断用户名是否为空
          if(username == ""){
            alert("用户名不能为空！");
            //取消默认行为
            return false;
          }
          //获取用户输入的密码
          var password = $("#password").val();
          if(password == ""){
            alert("密码不能为空！");
            return false;
          }
        });
        //切换span标签中的信息
        if("{{.}}"==="用户名或密码不正确！"){
          //设置span标签中的文本值
          $("#msg").text("用户名或密码不正确！");
          $("#msg").attr("style","color:red;")
        }
    });
  </script>
</head>
<body>
  <div id="login_page">
    <div class="logo"><img alt="" src="/static/img/logo.png" style="width: 50px;height: 50px"> 猫眼电影</div>
    <div id="content">
        <div class="picture"><img src="/static/img/3.jpg" style="width: 320px;height: 400px"></div>

        <div class="form" style="margin-top: 0px">
          <form action="/login?flag=1" method="post">
            <div class="errorMsg" id="msg" style="color:blue;">请输入用户名和密码</div><br/>
            <label>用户名称：</label>
            <input class="itxt" type="text" placeholder="请输入用户名" autocomplete="off" tabindex="1" name="username" id="username"/>
            <br />
            <br />
            <label>用户密码：</label>
            <input class="itxt" type="password" placeholder="请输入密码" autocomplete="off" tabindex="1" name="password" id="password"/>
            <br />
            <br />
            <br />
            <input type="submit" value="登录" id="sub_btn" />
            <div >
              <br>
              <a href="/pages/user/register.html">立即注册</a>
            </div>
          </form>
      </div>
    </div>
  </div>

</body>
</html>